<template>
  <div id="app">
    <app-top></app-top>
    <div class="main-container ace-save-state" id="main-container">
      <app-left></app-left>
      <div class="main-content">
        <div class="main-content-inner">
          <div class="breadcrumbs ace-save-state" id="breadcrumbs">
            <ul class="breadcrumb">
              <li>
                <i class="ace-icon fa fa-home home-icon"></i>
                <a >Home</a>
              </li>
              <li>
                <a >Other Pages</a>
              </li>
              <li class="active">Blank Page</li>
            </ul>
          </div>
          <div class="page-content">
            <div class="row">
              <div class="col-xs-12">
                <router-view></router-view>
              </div>
            </div>
          </div>
        </div>
      </div>
      <app-foot></app-foot>
    </div>
  </div>
</template>

<script>
import AppTop from './components/commons/AppTop'
import AppLeft from './components/commons/AppLeft'
import AppFoot from './components/commons/AppFoot'

export default {
  name: 'app',
  data: function () {
    return {

    }
  },
  methods: {
    
  },
  created: function() {
    
  },
  components: {
    AppTop,
    AppLeft,
    AppFoot
  }
}
</script>
